<!DOCTYPE HTML>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>用户权限管理系统</title>

    <link href="plugins/fullPage/jquery.fullPage.css" rel="stylesheet"/>
    <link href="plugins/bootstrap-3.3.0/css/bootstrap.min.css" rel="stylesheet"/>
    <link href="plugins/material-design-iconic-font-2.2.0/css/material-design-iconic-font.min.css" rel="stylesheet"/>
    <link href="plugins/waves-0.7.5/waves.min.css" rel="stylesheet"/>
    <link href="plugins/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.min.css" rel="stylesheet"/>
    <link href="app/css/admin.css" rel="stylesheet"/>
    <link href="app/css/skins.css" rel="stylesheet"/>
</head>
<body>
<div id="app">
    <div :id="system_skin">
        <admin-header v-on:click_sys_switch="sys_switch" v-on:click_search="search" :title="system_title"
                      :system_list="system_list" :user_menus="user_menus"></admin-header>
        <admin-main v-on:click_open_tab="open_tab" :user="user" :user_menus="user_menus" :menus="menus"></admin-main>
    </div>
</div>
<template id="admin-header">
    <header id="header">
        <ul id="menu">
            <li id="guide" class="line-trigger">
                <div class="line-wrap">
                    <div class="line top"></div>
                    <div class="line center"></div>
                    <div class="line bottom"></div>
                </div>
            </li>
            <li id="logo" class="hidden-xs">
                <a href="/">
                    <img src="app/img/logo.png"/>
                </a>
                <span id="system_title" v-text="title">权限管理系统</span>
            </li>
            <li class="pull-right">
                <ul class="hi-menu">
                    <!-- 搜索 -->
                    <li class="dropdown">
                        <a class="waves-effect waves-light" data-toggle="dropdown" href="javascript:;">
                            <i class="him-icon zmdi zmdi-search"></i>
                        </a>
                        <ul class="dropdown-menu dm-icon pull-right">
                            <form id="search-form" class="form-inline" v-on:submit.prevent="search">
                                <div class="input-group">
                                    <input id="keywords" type="text" :value="search_text" v-model="search_text"
                                           class="form-control" placeholder="搜索"/>
                                    <div class="input-group-btn">
                                        <button type="submit" class="btn btn-default"><span
                                                class="glyphicon glyphicon-search"></span></button>
                                    </div>
                                </div>
                            </form>
                        </ul>
                    </li>
                    <li class="dropdown">
                        <a class="waves-effect waves-light" data-toggle="dropdown" href="javascript:;">
                            <i class="him-icon zmdi zmdi-dropbox"></i>
                        </a>
                        <!--请选择系统切换-->
                        <ul class="dropdown-menu dm-icon pull-right">
                            <li class="skin-switch">
                                请选择系统切换
                            </li>
                            <li class="divider"></li>
                            <li v-for="sys in system_list" v-on:click="sys_switch(sys)">
                                <a class="waves-effect switch-systems" href="javascript:;"><i class="zmdi"
                                                                                              :class="sys.icon"></i>
                                    {{sys.title}}</i></a>
                            </li>
                        </ul>
                    </li>
                    <li class="dropdown">
                        <a class="waves-effect waves-light" data-toggle="dropdown" href="javascript:;">
                            <i class="him-icon zmdi zmdi-more-vert"></i>
                        </a>
                        <ul class="dropdown-menu dm-icon pull-right">
                            <li class="hidden-xs">
                                <a class="waves-effect" data-ma-action="fullscreen" href="javascript:fullPage();"><i
                                        class="zmdi zmdi-fullscreen"></i> 全屏模式</a>
                            </li>
                            <li>
                                <a class="waves-effect" data-ma-action="clear-localstorage"
                                   href="javascript:clearCookies();"><i
                                        class="zmdi zmdi-delete"></i> 清除缓存</a>
                            </li>
                            <!--菜单-->
                            <li v-for="m in user_menus">
                                <a v-if='m.isOpenTab' class="waves-effect" href="javascript:;" v-on:click="open_tab(m)"><i
                                        class="zmdi" :class="m.icon"></i> {{m.title}}</a>
                                <a v-else='' class="waves-effect" :href="m.url"><i class="zmdi" :class="m.icon"></i>
                                    {{m.title}}</a>
                            </li>

                        </ul>
                    </li>
                </ul>
            </li>
        </ul>
    </header>
</template>

<template id="admin-main">
    <section id="main">
        <!-- 左侧导航区 -->
        <admin-sidebar v-on:open_tab="open_tab" :user="user" :user_menus="user_menus" :menus="menus"></admin-sidebar>
        <!-- /左侧导航区 -->
        <section id="content">
            <div class="content_tab">
                <div class="tab_left">
                    <a class="waves-effect waves-light" href="javascript:;"><i class="zmdi zmdi-chevron-left"></i></a>
                </div>
                <div class="tab_right">
                    <a class="waves-effect waves-light" href="javascript:;"><i class="zmdi zmdi-chevron-right"></i></a>
                </div>
                <ul id="tabs" class="tabs">
                    <li id="tab_home" data-index="home" data-closeable="false" class="cur">
                        <a class="waves-effect waves-light">首页</a>
                    </li>
                </ul>
            </div>
            <div class="content_main">
                <div id="iframe_home" class="iframe cur">

                    <p></p>
                    <h3>SanJi Boot
                        <small>v2.0 <i style="color:#c00">去繁就简 重新出发</i></small>
                        <a href='https://gitee.com/sunxyz/sanji-boot/stargazers'><img
                                src='https://gitee.com/sunxyz/sanji-boot/badge/star.svg?theme=white' alt='star'></img></a><a
                                href='https://gitee.com/sunxyz/sanji-boot/members'><img
                                src='https://gitee.com/sunxyz/sanji-boot/badge/fork.svg?theme=white' alt='fork'></img></a>
                    </h3>
                    <p><b>演示地址</b>：<a href="http://www.zhangshuzheng.cn/zhengAdmin" target="_blank">http://47.98.125.142:8086/</a>
                    </p>
                    <p><b>系统简介</b>：SanJi Boot快速开发框架。基于Spring Boot 集成一些常用的功能，你只需要基于它做些简单的修改即可</p><br>
                    <p>
                    </p>
                    <p></p><h4>功能列表：</h4>
                    <p></p>
                    <p><b>用户管理</b>：用户增加、删除、修改、查询功能。</p>
                    <p><b>角色管理</b>：角色增加、删除、修改、查询功能。</p>
                    <p><b>菜单管理</b>：菜单增加、删除、修改、查询功能。</p>
                    <p><b>操作日志</b>：提供记录用户操作日志。</p><br>
                    <p></p><h4>待办：</h4>
                    <p></p>
                    <p><b>部门管理</b>、<b>字典管理</b>、<b>代码生成</b>、<b>接口文档</b></p><br>
                    <p></p><h4>下步规划：</h4>
                    <p></p>
                    <p><b>前后端分离</b>、<b>多前端模板</b></p><br>
                    <p></p><h4>感谢：</h4>
                    <p></p>
                    <p><b><a href="https://gitee.com/nullpointerxyz" title="提供的服务器资源">@空指针亦常</a></b>、<b><a
                            href="https://gitee.com/shuzheng" title="开源的zhengAdmin前端页面">@shuzheng</a></b></p><br>
                </div>
            </div>
        </section>
    </section>
</template>
<template id="admin-sidebar">
    <aside id="sidebar">
        <!-- 个人资料区 -->
        <div class="s-profile">
            <a class="waves-effect waves-light" href="javascript:;">
                <div class="sp-pic">
                    <img :src="user.avater"/>
                </div>
                <div class="sp-info">
                    {{user.name}} 您好！
                    <i class="zmdi zmdi-caret-down"></i>
                </div>
            </a>
            <ul class="main-menu">
                <!--菜单-->
                <li v-for="m in user_menus">
                    <a v-if='m.isOpenTab' class="waves-effect" href="javascript:;" v-on:click="open_tab(m)"><i
                            class="zmdi" :class="m.icon"></i> {{m.title}}</a>
                    <a v-else='' class="waves-effect" :href="m.url"><i class="zmdi" :class="m.icon"></i> {{m.title}}</a>
                </li>
            </ul>
        </div>
        <!-- /个人资料区 -->
        <!-- 菜单区 -->
        <ul class="main-menu">
            <template v-for="menu in menus">
                <li v-if="menu.children==null">
                    <a v-if='menu.isOpenTab' class="waves-effect" href="javascript:;" v-on:click="open_tab(menu)"><i
                            class="zmdi" :class="menu.icon"></i> {{menu.title}}</a>
                    <a v-else='' class="waves-effect" :href="menu.url"><i class="zmdi" :class="menu.icon"></i>
                        {{menu.title}}</a>
                </li>
                <li v-else class="sub-menu system_menus ">
                    <a class="waves-effect" href="javascript:;"><i class="zmdi" :class="menu.icon"></i>
                        {{menu.title}}</a>
                    <!--菜单-->
                    <ul>
                        <li v-for="m in menu.children">
                            <a v-if='m.isOpenTab' class="waves-effect" href="javascript:;" v-on:click="open_tab(m)"><i
                                    class="zmdi" :class="m.icon"></i> {{m.title}}</a>
                            <a v-else='' class="waves-effect" :href="m.url"><i class="zmdi" :class="m.icon"></i>
                                {{m.title}}</a>
                        </li>
                    </ul>
                </li>
            </template>
            <!-- 此处可以交给vue-->
            <li>
                <div class="upms-version">
                    &copy; SJ-Boot V2.0.0
                </div>
            </li>
        </ul>
        <!-- /菜单区 -->
    </aside>
</template>
<footer id="footer"></footer>

<script src="plugins/jquery.1.12.4.min.js"></script>
<script src="plugins/bootstrap-3.3.0/js/bootstrap.min.js"></script>
<script src="plugins/waves-0.7.5/waves.min.js"></script>
<script src="plugins/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="plugins/BootstrapMenu.min.js"></script>
<script src="plugins/device.min.js"></script>
<script src="plugins/fullPage/jquery.fullPage.min.js"></script>
<script src="plugins/fullPage/jquery.jdirk.min.js"></script>
<script src="plugins/jquery.cookie.js"></script>
<script src="plugins/vue/2.3.4/vue.min.js"></script>
<script src="app/js/admin.js"></script>
<script src="app/js/i-ajax.js"></script>
<script src="app/js/admin-vue.js">
</script>
</body>
</html>